<template>
	<mescroll-uni :ref="'mescrollRef' + i" @init="mescrollInit" height="100%" :top="listTop" :down="downOption"
		@down="downCallback" :up="upOption" @up="upCallback" @emptyclick="emptyClick">
		<!-- 数据列表 -->
		<view class="goods-list single-column">
			<view class="goods-item margin-bottom" v-for="(item, index) in orderList" :key="index">
				<u-card>
					<view class="item-box">
						<view @click="toDetail(item)">
							<view style="padding-top: 16rpx;">
								<u-row gutter="0">
									<u-col span="12">
										<view style="display: flex;flex-direction: row;justify-content: space-between;">
											<view>
												<text class="name" style="font-weight: bold;">订单号:{{ item.waybill_sn }}</text>
												
											</view>
											<view>
												<!-- <text class="name">运单等级：</text> -->
												<!-- <text class="value">{{ getLevel(item)}}</text> -->
												<text class="value" style="margin-right: 16rpx;"> {{ waybillStatus(item) }}</text>
											</view>
										</view>

									</u-col>
								</u-row>
							</view>
							<view class="bottom-line">
								<view class="line"></view>
							</view>
							<view class="type-box">
								<u-row gutter="0">
									<u-col span="3">
										<view class="good-item"> <text class="name">货物名称</text></view>
									</u-col>
									<u-col span="2">
										<view class="good-item"> <text class="name">包装</text></view>
									</u-col>
									<u-col span="2">
										<view class="good-item"> <text class="name">数量</text></view>
									</u-col>
									<u-col span="2">
										<view class="good-item"> <text class="name">总(KG)</text></view>
									</u-col>
									<u-col span="2">
										<view class="good-item"> <text class="name">总(方)</text></view>
									</u-col>
								</u-row>
								<u-row gutter="0" v-for="(goodItem ,row) in item.goods" :key="row">
									<u-col span="3">
										<text class="value">{{ goodItem.goods_name }}</text>
									</u-col>
									<u-col span="2">
										<text class="value">{{ goodItem.goods_pack }}</text>
									</u-col>
									<u-col span="2">
										<text class="value">{{ goodItem.goods_nums }}</text>
									</u-col>
									<u-col span="2">
										<text class="value"> {{ goodItem.total_weight }}</text>
									</u-col>
									<u-col span="2">
										<text class="value">{{ goodItem.total_volume }}</text>
									</u-col>
								</u-row>
								<u-row gutter="0">

									<u-col span="6">
										<!-- <text class="name">总运费：</text>
										<text class="value">{{ item.all_order_amount }}</text> -->
										<text class="name">运单等级：</text>
										<text class="value">{{ getLevel(item)}}</text>
									</u-col>
									<u-col span="6">
										<text class="name">目的城市：</text>
										<text class="value">{{ getDestinationCity(item) }}</text>
									</u-col>
								</u-row>
								<u-row gutter="0">
									<u-col span="6">
										<text class="name">二级发货凭证：{{ getDepartPic2(item) }}</text>
									</u-col>
									<u-col span="6">
										<text class="name">一级到货凭证：{{ getArrivePic1(item) }}</text>
									</u-col>
								</u-row>
								<u-row gutter="0">
									<u-col span="6">
										<text class="name">一级发货凭证：{{ getDepartPic1(item) }}</text>
									</u-col>
									<u-col span="6">
										<text class="name">分拨中心到货凭证：{{ getAllocatePic1(item) }}</text>
									</u-col>
								</u-row>
								<u-row gutter="0">
									<u-col span="12">
										<text class="name">分拨凭证：{{ getAllocatePic2(item) }}</text>
									</u-col>

								</u-row>
								<u-row gutter="0">
									<u-col span="12">
										<text class="name">备注：{{ item.remark }}</text>
									</u-col>
								</u-row>
							</view>
						</view>
						<view class="btns-box">
							<view class="pay" v-if="getDepartBtnShow(item)" @click="carLoading(item)">发货凭证</view>
							<view class="pay" v-if="getAllocationBtnShow(item)" @click="carLoading(item)">分拨凭证</view>
						</view>

					</view>
				</u-card>
			</view>
		</view>
		<view v-if="orderList.length == 0 && emptyShow"><ns-empty text="暂无运单" :isIndex="false" :emptyType="emptyType"></ns-empty></view>

		<loading-cover ref="loadingCover"></loading-cover>
	</mescroll-uni>
</template>

<script>
	import listitem from './waybill-list.js';
	import MescrollMixin from '@/components/mescroll-uni/mescroll-mixins.js';
	import MescrollMoreItemMixin from '@/components/mescroll-uni/mixins/mescroll-more-item.js';

	export default {
		mixins: [MescrollMixin, MescrollMoreItemMixin, listitem], // 注意此处还需使用MescrollMoreItemMixin (必须写在MescrollMixin后面)
		data() {
			return {

			};
		},
		methods: {

		}
	};
</script>

<style lang="scss">
	@import './waybill-list.scss';
</style>